<template>
    <div>
        <el-dialog title="重新登陆" :visible.sync="DialogVisible" width="15%" append-to-body  :modal="false">
            <el-form :model="Valid" ref="Valid" class="forms" status-icon>
                <el-form-item prop="name" label="" :disabled="true">
                    <el-input v-model="Valid.name" placeholder="身份证号" class="input-with-select" clearable></el-input>
                    <span class="el-input__prefix"><i class="fa-user"></i></span>
                </el-form-item>
                <el-form-item prop="password" @keyup.13="submitForm('Valid')" label="" :rules="[{ required: true, message: '请输入密码', trigger: ['blur','change'] }]">
                    <el-input type="password" v-model="Valid.password" autocomplete="off" placeholder="密码" clearable></el-input>
                    <span class="el-input__prefix"><i class="fa-unlock-alt"></i></span>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary"  @click="submitForm('Valid')"  class="btclass">登陆</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>
<script>
    import {mapActions} from 'vuex';
    // import md5 from "../../js/md5.js";
    export default {
        data: () => ({
            DialogVisible: false,
            Valid: {
                name: "",
                password: "",
            },
        }),
        mounted()
        {
            let _this=this;
            document.onkeydown=e=>{
                let _key=window.event.keyCode;
                if(_key===13){
                    this.submitForm('Valid');
                }
            }
             this.$Common.Config.this=this;
        },
        watch: {
            "DialogVisible":{
                handler(){
                    if(this.DialogVisible==true){
                        if(this.$store.state.user.phone){
                            this.Valid.phone=this.$store.state.user.phone;
                        }
                        if(this.$store.state.user.password){
                            this.Valid.password=this.$store.state.user.password;
                        }
                    }
                },
                deep:true
            }
        },
        methods: {
            ...mapActions(['Login']),
            submitForm(formName) {
                this.$refs[formName].validate(valid => {
                    if (valid) {
                        this.LoginAjax();
                    }
                });
            },
            LoginAjax() {
                let postdata =  {
                    type: "login",
                    split: JSON.stringify({
                        UserName: this.Valid.name,
                        PassWord: this.Valid.password// md5(this.Valid.password)
                    })
                }
                let _this=this;
                this.$Loading.start();
                this.Login(postdata)
                .then(function(data){
                    if(data==false){
                        _this.$Loading.finish();
                        _this.$message({
                            message: '用户名或密码错误',
                            type: 'error',
                            duration:1000
                        })
                        
                    }
                    else{
                        _this.$Loading.finish();
                        _this.$parent.showLoginagain=false;
                        
                    }  
                    
                })
            },
        }
    }
</script>
<style>
</style>